﻿<internals:PageBase
    x:Class="JV.Com.Views.DetailGamePage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:prism="using:Microsoft.Practices.Prism.StoreApps"
    xmlns:internals="using:JV.Com.Internals"
    xmlns:converters="using:JV.Com.Converters"
    prism:ViewModelLocator.AutoWireViewModel="true">

    <Page.Resources>
        <converters:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />
    </Page.Resources>

    <Grid>
        <ProgressRing HorizontalAlignment="Center" VerticalAlignment="Center" IsActive="{Binding InLoading}"
                      Height="50" Width="50" Foreground="{StaticResource DataItemBorderThemeBrush}" />

        <Hub Background="{StaticResource ApplicationBackgroundThemeBrush}" HorizontalContentAlignment="Stretch" Visibility="{Binding InLoading, Converter={StaticResource IB2VConverter}}">
            <Hub.Transitions>
                <TransitionCollection>
                    <EntranceThemeTransition />
                </TransitionCollection>
            </Hub.Transitions>
            <Hub.Header>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="80"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Button  x:Name="backButton" Style="{StaticResource NavigationBackButtonNormalStyle}"
                    Margin="-1,-1,39,0" 
                    VerticalAlignment="Top"
                    Command="{Binding GoBackCommand}"
                    AutomationProperties.Name="Back"
                    AutomationProperties.AutomationId="BackButton"
                    AutomationProperties.ItemType="Navigation Button"/>
                    <TextBlock x:Name="pageTitle" Text="{Binding PageTitle}" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                    VerticalAlignment="Top" IsHitTestVisible="false" TextWrapping="NoWrap" />
                    <SearchBox
                    Grid.Column="2" VerticalAlignment="Center"
                    Height="35" Width="270"
                    PlaceholderText="Rechercher" QueryText="{Binding Query}"
                    SuggestionsRequested="SearchBox_SuggestionsRequested"
                    QuerySubmitted="SearchBox_QuerySubmitted" />
                </Grid>
            </Hub.Header>
            <HubSection>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <Border BorderBrush="{StaticResource DataItemBorderThemeBrush}" BorderThickness="1" Margin="0,0,20,0"
                            VerticalAlignment="Top">
                            <Image Source="{Binding LargeImageUrl}" Stretch="None" />
                        </Border>

                        <ItemsControl Grid.Column="1" ItemsSource="{Binding Metadatas}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Visibility="{Binding Value, Converter={StaticResource NullToVisibilityConverter}}">
                                        <TextBlock.Inlines>
                                            <Run Text="{Binding Caption}" FontWeight="Bold" FontSize="16" />
                                            <Run Text=" : " FontWeight="Bold" FontSize="16" />
                                            <Run Text="{Binding Value}" FontWeight="Normal" FontSize="16" />
                                        </TextBlock.Inlines>
                                    </TextBlock>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                        </ItemsControl>
                    </Grid>
                </DataTemplate>
            </HubSection>
            <HubSection Header="Articles">
                <DataTemplate>
                    <ListView ItemsSource="{Binding Articles}" ItemContainerStyle="{StaticResource LittleListViewItemStyle}"
                          SelectionMode="None" IsItemClickEnabled="True" ItemClick="Articles_ItemClick">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" />
                                        <RowDefinition Height="Auto" />
                                    </Grid.RowDefinitions>
                                    <TextBlock Text="{Binding Title}" Style="{StaticResource SearchTitleItemTextBlockStyle}"
                                                   TextAlignment="Left" TextWrapping="Wrap" />
                                    <TextBlock Text="{Binding FormattedType}" Grid.Row="1"
                                                   TextAlignment="Left" Style="{StaticResource SummaryItemTextBlockStyle}" />
                                </Grid>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <ItemsWrapGrid ItemWidth="300" />
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                    </ListView>
                </DataTemplate>
            </HubSection>
            <HubSection Header="Screenshots">
                <DataTemplate>
                    <FlipView ItemsSource="{Binding LargeScreenshots}" Width="600" Height="338" VerticalAlignment="Top">
                        <FlipView.ItemTemplate>
                            <DataTemplate>
                                <Image Source="{Binding}" Stretch="UniformToFill" VerticalAlignment="Center"
                                   HorizontalAlignment="Center" />
                            </DataTemplate>
                        </FlipView.ItemTemplate>
                    </FlipView>
                </DataTemplate>
            </HubSection>
        </Hub>
    </Grid>
</internals:PageBase>
